
   $(function () {
        // 菜单轮播图
       $('#slider').slidebox({
            boxh: 400,//盒子的高度
            w: 1000,//图片的宽度
            h: 400,//图片的高度
            isShow: true,//是否显示控制器
            isShowBtn: true,//是否显示左右按钮
            controltop: 10,//控制按钮上下偏移的位置,要将按钮向下移动   首先保证boxh 高度>图片 h
            controlsW: 12,//控制按钮宽度
            controlsH: 12,//控制按钮高度
            radius: 6,//控制按钮圆角度数
            controlsColor: '#f60', //普通控制按钮的颜色
            controlsCurrentColor: 'gold' //当前控制按钮的颜色
       })

        // 电子书轮播图
        $('.bslider').slidebox({
            boxh: 219,//盒子的高度
            w: 329,//图片的宽度
            h: 219,//图片的高度
            isShow: true,//是否显示控制器
            isShowBtn: true,//是否显示左右按钮
            controltop: 10,//控制按钮上下偏移的位置,要将按钮向下移动   首先保证boxh 高度>图片 h
            controlsW: 7,//控制按钮宽度
            controlsH: 7,//控制按钮高度
            radius: 6,//控制按钮圆角度数
            controlsColor: '#f60', //普通控制按钮的颜色
            controlsCurrentColor: 'gold' //当前控制按钮的颜色
        })

        //电子书选项卡
        $('.book  .book-menu li').click(function(){
            //为当前li添加激活样式
            $(this).addClass('active').siblings().removeClass()

            //获取当前索引
            let index = $(this).index();

            //显示当前索引对应的内容
            $('.book-list').removeClass('on').eq(index).addClass('on')
        })

        //服装选项卡
        $('.cloth .book-menu li').click(function(){
            //为当前li添加激活样式
            $(this).addClass('active').siblings().removeClass()

            //获取当前索引
            let index = $(this).index();

            //显示当前索引对应的内容
            $('.cloth-right').removeClass('on').eq(index).addClass('on')
        })

        //户外运动选项卡
        $('.sport .book-menu li').click(function(){
            //为当前li添加激活样式
            $(this).addClass('active').siblings().removeClass()

            //获取当前索引
            let index = $(this).index();

            //显示当前索引对应的内容
            $('.sport .cloth-right').removeClass('on').eq(index).addClass('on')
        })

        //童装选项卡
        $('.child .book-menu li').click(function(){
            //为当前li添加激活样式
            $(this).addClass('active').siblings().removeClass()

            //获取当前索引
            let index = $(this).index();

            //显示当前索引对应的内容
            $('.child .cloth-right').removeClass('on').eq(index).addClass('on')
        })

        //电子书手风琴
        $('.book-right li').mouseenter(function(){

            //隐藏其他li下面的div
            $('.book-right li div').hide()

            //显示当前li下面的div
            $('div',this).show()

            //显示其他li下面的h5
            $('.book-right li h5').show()

            //显示当前li下面的h5
            $('h5',this).hide()
        })

        //服装轮播图
        $('.cslider').slidebox({
            boxh: 322,//盒子的高度
            w: 430,//图片的宽度
            h: 322,//图片的高度
            isShow: true,//是否显示控制器
            isShowBtn: true,//是否显示左右按钮
            controltop: 10,//控制按钮上下偏移的位置,要将按钮向下移动   首先保证boxh 高度>图片 h
            controlsW: 10,//控制按钮宽度
            controlsH: 10,//控制按钮高度
            radius: 6,//控制按钮圆角度数
            controlsColor: '#f60', //普通控制按钮的颜色
            controlsCurrentColor: 'gold' //当前控制按钮的颜色
        })

        //楼层滚动
        $('.floor li').hover(function(){

            let bgcolor = $(this).data('bgcolor')

            //修改当前的背景色
            $(this).css({
                'background-color':bgcolor,
                'background-position-x':-40,
                'width':80
            })

        },function(){

            $(this).css({
                'background-color': '',
                'background-position-x': 0,
                'width':40
            })

        }).on('click',function(){
            
            //获取当前floor下li的索引值
            let index = $(this).index();

            //获取对应楼层盒子下floor-box距离文档顶部的偏移
            let sTop = $('.floor-box').eq(index).offset().top

            //设置滚动条的距离
            $('html,body').animate({scrollTop: sTop},300)

        })

        //固定顶部搜索框
        $(window).on('scroll',function(){

            //获取当前滚动条的距离
            let sTop = parseInt($('html,body').scrollTop());

            if(sTop > 700){
                //显示顶部框
                $('.fix-top').slideDown()
                //将搜索框追加到顶部框内
                $('.head-search').appendTo('.fix-top')
            }else{
                //隐藏顶部框
                $('.fix-top').slideUp()
                //将搜索框追加到头部中
                $('.head-search').appendTo('.search-box')
            }
        }) 
    })
